/* 样式变量 */
:root {
  --vt-c-text-dark-1: rgb(255 255 255 / 87%);
  --vt-c-text-dark-2: rgb(235 235 235 / 60%);
  --vt-c-text-light-1: #213547;
  --vt-c-text-light-2: rgb(60 60 60 / 70%);
  --vt-c-text-light-3: rgb(255 255 255 / 60%);
  --vt-c-white: #fff;
  --vt-c-white2: #F8F8F8;
  --vt-c-black: #1a1a1a;
  --vt-c-black2: #1a1a1a;
  --vt-c-white-mute: #f1f1f1;
  --vt-c-white-mute2: rgb(255 255 255 / 40%);
  --vt-c-black-mute: #2f2f2f;
  --vt-c-black-mute2: rgb(5 5 5 / 6%);
  --vt-c-divider-light-1: rgb(60 60 60 / 29%);
  --vt-c-divider-light-2: rgb(0 0 0 / 6%);
  --vt-c-divider-dark-1: rgb(84 84 84 / 65%);
  --vt-c-divider-dark-2: rgb(84 84 84 / 48%);
  --vt-shadow-1: 0 1px 2px rgb(0 0 0 / 4%), 0 1px 2px rgb(0 0 0 / 6%);
  --vt-shadow-2: 0 3px 12px rgb(0 0 0 / 7%), 0 1px 4px rgb(0 0 0 / 7%);
  --vt-shadow-3: 0 12px 32px rgb(0 0 0 / 10%), 0 2px 6px rgb(0 0 0 / 8%);
  --text-color: #000000d9;
  --hover-color: #194597;
  --red-color:#B91545;
  --border-color: rgb(0 0 0 / 6%);
  --vt-c-gray: #8e8e8e;
  --vt-nav-height: 64px;
  --edit-border-color: #eee
}

/* 白天主题样式 */
.dark {
  --vt-c-bg: var(--vt-c-white);
  --vt-c-bg2: var(--vt-c-white2);
  --vt-c-bg-mute: var(--vt-c-white-mute);
  --vt-c-bg-mute2: var(--vt-c-black-mute2);
  --vt-c-divider: var(--vt-c-divider-light-1);
  --vt-c-border-1: var(--edit-border-color);
  --vt-c-text-1: var(--vt-c-text-light-1);
  --vt-c-text-2: var(--vt-c-text-light-2);
  --vt-c-divider-light: var(--vt-c-divider-light-1);
  --vt-c-divider-light2: var(--vt-c-divider-light-2);
}

/* 夜晚主题样式 */
.light {
  --vt-c-bg: var(--vt-c-black);
  --vt-c-bg2: var(--vt-c-black);
  --vt-c-bg-mute: var(--vt-c-black-mute);
  --vt-c-bg-mute2: var(--vt-c-white-mute2);
  --vt-c-border-1: var(--vt-c-divider-dark-2);
  --vt-c-text-1: var(--vt-c-text-dark-1);
  --vt-c-text-2: var(--vt-c-text-dark-2);
  --vt-c-divider: var(--vt-c-divider-dark-1);
  --vt-c-divider-light: var(--vt-c-divider-dark-2);
  --vt-c-divider-light2: var(--vt-c-divider-dark-2);
}

/* 滚动条大小 */
*::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
  color: #1a448d;
}

/* 滚动条样式 */
*::-webkit-scrollbar-thumb {
  background-color: #8b8b8b;
  border-radius: 4px;
}
button{
  border: unset;
  background: unset;
  box-sizing: content-box;
  color: var(--vt-c-text-1);
}
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.markdown {
  font-size: 14px;
  line-height: 2;
  color: var(--vt-c-text-1);
}

/* 图片预览container */
.img-preview-container {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.img-preview-container .img-preview-container-img {
  user-select: none;
  position: relative;
  z-index: 2;

  /* 禁止图片自带的拖拽 */
  -webkit-user-drag: none;
}

/* 图片预览container关闭 */
.img-preview-container-close {
  cursor: pointer;
  position: absolute;
  z-index: 2;
  top: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  transition: transform 0.5s;
}

.img-preview-container-close:hover {
  transform: rotate(90deg);
}

/* 图片预览蒙层 */
.img-preview-container::after {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  background: rgb(0 0 0 / 70%);
}

.tooltip-popover-container {
  position: fixed;
  padding: 10px 8px;
  font-size: 14px;
  color: var(--vt-c-bg);
  background: var(--vt-c-text-1);
  filter: drop-shadow(0 0.15em 0.1em #707070);
  border-radius: 4px;
}

.tooltip-popover-container::after {
  content: '';
  position: absolute;
  bottom: -17px;
  left: calc(50% - 9px);
  border: 9px solid transparent;
  border-top-color: var(--vt-c-text-1);
}

.xdj-row {
  display: flex;
  flex-flow: row wrap;
}

.xdj-flex-center {
  justify-content: center;
}

.xdj-flex-align-center {
  align-items: center;
}

.xdj-col-1 {
  flex: 1;
}

.xdj-col-2 {
  flex: 2;
}

.xdj-col-3 {
  flex: 3;
}

.xdj-col-4 {
  flex: 4;
}

.xdj-col-5 {
  flex: 5;
}